<!--
 * @Author: ZhaoZhiqi
 * @Date: 2024-10-24 15:13:22
 * @LastEditors: ZhaoZhiqi
 * @LastEditTime: 2024-10-24 17:46:12
 * @Description: 登录按钮
 * @FilePath: \charging-mini\充电项目\src\components\LoginButton.vue
-->
<template>
    <div class="login-button-contaienr">
        <div class="login-btn" @click="login">
            <img :src="imgs.plus" alt="" />
            <span> 点击登录 </span>
        </div>
        <div class="login-text">账户未登录</div>
    </div>
</template>
<script>
const app = getApp();
export default {
    props: {
        reLaunchUrl: {
            type: String,
            required: true,
        },
    },
    data() {
        return {
            imgs: app.globalData.imgs,
        };
    },
    methods: {
        login() {
            app.login().then((res) => {
                if (res.need_bind_phone) {
                    uni.navigateTo({
                        url: "/pages/login",
                    });
                } else {
                    uni.reLaunch({
                        url: this.reLaunchUrl,
                    });
                }
            });
        },
    },
};
</script>
<style lang="less" scoped>
.login-button-contaienr {
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    margin-top: 400rpx;
    .login-btn {
        background: linear-gradient(90deg, #8bdab0 0%, #08bfa8 100%);
        display: flex;
        align-items: center;
        justify-content: center;
        width: 200rpx;
        height: 60rpx;
        color: #fff;
        border-radius: 30rpx;
        font-size: 26rpx;
        line-height: 1;
        img {
            display: block;
            width: 24rpx;
            height: 24rpx;
            margin-right: 15rpx;
        }
    }
    .login-text {
        font-size: 24rpx;
        line-height: 1;
        margin-top: 20rpx;
        color: #999;
    }
}
</style>
